<template>
    <div class="declare">
        <headerCont :page="'login'" v-show="isHead==1?true:false"></headerCont>
        <div class="tishi">
            <fillingSteps :sblist="sblist" :currentInd="currentInd" />
        </div>
        <div class="main">
            <div class="main_left">
                <p class="bianhao" v-if="xmbh">编号：{{xmbh}}</p>
                <p class="bianhao" v-else>编号：材料确认后生成</p>
                <p v-for="(item, index) in sblist" :key="index"
                    :class="['pointer', currentInd==index?'active':'']"
                    @click="changeView(item, index)"
                >{{item.zlmlMc}}
                    <img class="arrow-right" v-if="currentInd==index" src="@/assets/img/arrow-right.png"/>
                </p>
            </div>
            <div class="main_right">
                <component v-bind:is="currentView" :is_modify="is_modify" :from="from"></component>
            </div>
        </div>
    </div>
</template>

<script>
import headerCont from '@/views/declarationSystem/common/header';
import fillingSteps from "./fillingSteps.vue";
import achieveBasicInfo from './achieveBasicInfo';
import patentBasicInfo from './patentBasicInfo';
import patentContactPeople from './patentContactPeople';
import completeUnit from './completeUnit';
import patentCompleteUnit from './patentCompleteUnit';
import completePeople from './completePeople';
import contactPeople from './contactPeople';
import declareTable from './declareTable';
import patentDeclareTable from './patentDeclareTable';
import benefit from './benefit';
import awardInfo from './awardInfo';
import certificate from './certificate';
import standardText from './standardText';
import enclosure from './enclosure';
import patentEnclosure from './patentEnclosure';
import unitIdea from './unitIdea';
import declareFinish from './declareFinish';
import patentDeclareFinish from './patentDeclareFinish';
import materialConfirm from './materialConfirm';
import patentMaterialConfirm from './patentMaterialConfirm'
import { cxjsb_list, cxjsbGetCxjByid } from '@/api/shenbao';
export default {
    name: 'Declare',
    data() {
        return {
            declarearr: [{
                name: '成果基本情况',
                viewname: 'achieveBasicInfo'
            },{
                name: '专利基本信息',
                viewname: 'patentBasicInfo'
            },{
                name: '专利联系方式',
                viewname: 'patentContactPeople'
            },{
                name: '申报及完成单位',
                viewname: 'completeUnit'
            },{
                name: '成果主要完成人',
                viewname: 'completePeople'
            },{
                name: '成果联系人',
                viewname: 'contactPeople'
            },{
                name: '申报表',
                viewname: 'declareTable'
            },{
                name: '申报表_专利',
                viewname: 'patentDeclareTable'
            },{
                name: '成果经济效益',
                viewname: 'benefit'
            },{
                name: '曾获奖励情况',
                viewname: 'awardInfo'
            },{
                name: '第三方评价证明',
                viewname: 'certificate'
            },{
                name: '标准文本',
                viewname: 'standardText'
            },{
                name: '附件',
                viewname: 'enclosure'
            },{
                name: '附件_专利',
                viewname: 'patentEnclosure'
            },{
                name: '单位意见',
                viewname: 'unitIdea'
            },{
                name: '申报完成',
                viewname: 'declareFinish'
            },{
                name: '申报完成',
                viewname: 'patentDeclareFinish'
            }],
            currentInd: 0,
            currentView: '',
            fl_bh: '',
            isHead: "",
            sblist: [],
            xmbh: '',
            is_modify: '',
            from: '',
        }
    },
    components: {
        headerCont,
        fillingSteps,
        achieveBasicInfo,
        patentBasicInfo,
        patentContactPeople,
        completeUnit,
        patentCompleteUnit,
        completePeople,
        contactPeople,
        declareTable,
        patentDeclareTable,
        benefit,
        awardInfo,
        certificate,
        standardText,
        enclosure,
        unitIdea,
        declareFinish,
        patentDeclareFinish,
        patentEnclosure,
        materialConfirm,
        patentMaterialConfirm,
    },
    methods: {
        changeView(item, index) {
            this.currentInd = index;
            var bh = item.zlmlBh.slice(-2);
            if (this.fl_bh=='51') {
                this.currentView = this.switchView5(bh);
            } else if (this.fl_bh=='31') {
                this.currentView = this.switchView3(bh);
            } else {
                this.currentView = this.switchView(bh);
            }
            // this.currentView = item.viewname;
        },
        switchView(bh) {
            switch(bh) {
                case '01': return 'achieveBasicInfo';
                case '02': return 'completeUnit';
                case '03': return 'completePeople';
                case '04': return 'contactPeople';
                case '05': return 'declareTable';
                case '06': return 'benefit';
                case '07': return 'awardInfo';
                case '08': return 'certificate';
                case '09': return 'enclosure';
                case '10': return 'materialConfirm';
                case '11': return 'unitIdea';
                case '12': return 'declareFinish';
                default: return 'achieveBasicInfo';
            }
        },
        switchView3(bh) {
            switch(bh) {
                case '01': return 'achieveBasicInfo';
                case '02': return 'completeUnit';
                case '03': return 'completePeople';
                case '04': return 'contactPeople';
                case '05': return 'declareTable';
                case '06': return 'benefit';
                case '07': return 'awardInfo';
                case '08': return 'certificate';
                case '09': return 'standardText';
                case '10': return 'enclosure';
                case '11': return 'materialConfirm';
                case '12': return 'unitIdea';
                case '13': return 'declareFinish';
                default: return 'achieveBasicInfo';
            }
        },
        switchView5(bh) {
            switch(bh) {
                case '01': return 'achieveBasicInfo';
                case '02': return 'patentCompleteUnit';
                case '03': return 'patentBasicInfo';
                case '04': return 'patentContactPeople';
                case '05': return 'patentDeclareTable';
                case '06': return 'patentEnclosure';
                case '07': return 'patentMaterialConfirm';
                case '08': return 'unitIdea';
                case '09': return 'patentDeclareFinish';
                default: return 'achieveBasicInfo';
            }
        },
        get_cxjsb_list() {
            let that = this;
            cxjsb_list({
                fl_bh: that.fl_bh
            }).then(res=>{
                if (res.data.code == '200') {
                    this.sblist = res.data.result;
                    var bh = this.sblist[0].zlmlBh.slice(-2);
                    if (this.fl_bh=='51') {
                        this.currentView = this.switchView5(bh);
                    } else if (this.fl_bh=='31') {
                        this.currentView = this.switchView3(bh);
                    } else {
                        this.currentView = this.switchView(bh);
                    }
                }
            })
        },
        getCxjsbGetCxjByid(){
            cxjsbGetCxjByid({
                cxj_cxj_id: this.$route.query.cxj_cxj_id
            }).then(res=>{
                let data = res.data;
                if (data.success) {
                    this.xmbh = data.result.cxj_xmbh;
                    if (this.xmbh) {
                        document.title = '电力创新奖平台-' + this.xmbh;
                    }
                    let from = this.$route.query.from;
                    let tjztbh = this.$route.query.tjztbh;
                    let xmztbh = this.$route.query.xmztbh;
                    /**
                     * 【from】来源【管理员{gly}、专家{zj}、推荐单位{zj}】
                     * 【xmztbh】材料补正状态的成果，形审专家不能修改，只有管理员角色和申报用户自己能够对成果进行修改，其他角色都不能修改
                     * 【tjztbh】成果资料推荐退回的成果，推荐单位、专家是不允许修改的，只有管理员角色可以修改
                    */
                    if (from == 'zj' && tjztbh == '201') {
                        this.is_modify = 'N'
                    } else if (from == 'zj' &&  xmztbh =='302') {
                        this.is_modify = 'N'
                    }else if (from = 'gly') {
                        this.is_modify = data.result.is_modify;
                    } else {
                        this.is_modify = data.result.is_modify;
                    }
                }
            })
        },
    },
    mounted() {
        this.fl_bh = this.$route.query.type;
        this.isHead = this.$route.query.isHead;
        this.from = this.$route.query.from;
        this.get_cxjsb_list();
        this.getCxjsbGetCxjByid();
        this.tjztbh = sessionStorage.getItem('tjztbh');
    }
}
</script>
<style lang="less">
p {
    margin-top: 0;
    margin-bottom: 0;
}
</style>
<style lang="less" scoped>
.declare {
    background: #f7f7f7;
}
.main {
    width: 1420px;
	margin: 0 auto;
    padding-top: 20px;
    padding-bottom: 50px;
    min-height: 460px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    .main_left {
        width: 250px;
        p {
            border-bottom: 1px solid #EEEEEE;
            border-right: 1px solid #EEEEEE;
            height: 52px;
            line-height: 52px;
            background: #FFFFFF;
            padding-left: 60px;
            font-size: 15px;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            position: relative;
            .arrow-right {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                right: 30px;
                width: 20px;
                height: 20px;
            }
        }
        .bianhao {
            background: #EBF5FF;
            color: #006DC0;
        }
        .active {
            background: linear-gradient(90deg, #267FEA 0%, #519FF8 100%);
            color: #FFFFFF;
        }
    }
    .main_right {
        flex: 1;
        margin-left: 20px;
        background: #FFFFFF;
        //padding-left: 20px;
        box-sizing: border-box;
        overflow: auto;
    }
}
.tishi {
    position: relative;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;font-size: 15px;
    font-weight: 400;
    border: solid 1px #eee;
    background: #fff;
    color: #006DC0;
    width: 1420px;
    margin: 0 auto;
    line-height: 40px;
    margin-top: 20px;
    padding: 20px;
    overflow-x: auto;
    min-height: 130px;
 }
</style>import { overflow } from 'html2canvas/dist/types/css/property-descriptors/overflow';

